<!DOCTYPE html>
<html lang="en"; xmlns:th="http://www.w3.org/1999/xhtml">
<head>
    <meta charset="UTF-8">
    <title>巡检任务的制定与分配</title>
    <link rel="stylesheet" href="/static/component/pear/css/pear.css">
    <link rel="stylesheet" href="/webjars/layui/2.5.5/css/layui.css"  media="all">
    <style>
        *{margin: 0px auto;
            padding: 0px;
        }
        .q:after{
            content:'';
            display: block;
            clear: both;
        }
        .layui-table-cell{
            height: 30px;
        }
        .message li{
             float:  left;
             font-size: 16px;
             margin-right: 30px;
        }
        .message li span{
          margin-left: 3px;
        }
        .message ul{
           margin-top: 20px;
        }
        .message ul span{
            color: gray;
        }
        .XianLuXinXi{

        }
        .XianLuXinXi ul{

        }
        .XianLuXinXi .zuo{
            float: left;
            width: 280px;
            height: 350px;
        }
        .XianLuXinXi .you{
            float: left;
            width: 280px;
            height: 350px;
        }
        .XianLuXinXi li{
            font-size: 14px;
            margin-top: 20px;
            margin-left: 40px;
        }
    </style>
</head>
<body>

<!--查询条件-->
<form class="layui-form" action="">
    <div class="layui-form-item" style="margin-top: 50px">
        <div class="layui-inline">
            <label class="layui-form-label">任务编号:</label>
            <div class="layui-input-inline">
                <input type="text" name="title" id="RenWuBiAnHao" lay-verify="title" autocomplete="off" placeholder="请输入任务编号" class="layui-input">
            </div>
            <label class="layui-form-label">线路名称：</label>
            <div class="layui-input-inline">
                <input type="text" name="title" id="XianLu" lay-verify="title" autocomplete="off" placeholder="请输入线路编号" class="layui-input">
            </div>
            <label class="layui-form-label">任务状态:</label>
            <div class="layui-input-inline">
                <select name="city" lay-verify="" id="dp" class="service3">
                    <option value="0">请选择</option>
                </select>
            </div>
            <div class="layui-input-inline">
                <button type="button" class="layui-btn layui-btn-normal zengJiQxMessage" id="zengJia" onclick="addXunJian()"><i class="layui-icon">&#xe608;</i>制定巡检任务</button>
            </div>
        </div>
        <div class="layui-inline" style="margin-top: 20px">
            <label class="layui-form-label">*下发人:</label>
            <div class="layui-input-inline">
                <input type="text" name="title" id="xiaFaRen" lay-verify="title" autocomplete="off" placeholder="请输入任务编号" class="layui-input">
            </div>
            <label class="layui-form-label">下放时间：</label>
            <div class="layui-input-inline">
                <input type="text" class="layui-input"  placeholder="" id="kaishi">
            </div>
            <label class="layui-form-label">时间结束:</label>
            <div class="layui-input-inline">
                <input type="text" class="layui-input"  placeholder="" id="jeiShu">
            </div>
            <div class="layui-input-inline">
                <button type="submit" class="layui-btn layui-btn-normal zengJiQxMessage" lay-submit  lay-filter="user-query">
                    查询
                </button>
            </div>
            <!--<li>-->
            <!--    <a id="time"></a>-->
            <!--    <script th:inline="javascript">-->
            <!--        /*<![CDATA[*/-->
            <!--        function setTime(){-->
            <!--            var dt=new Date();-->
            <!--            var arr_week=new Array("星期日","星期一","星期二","星期三","星期四","星期五","星期六");-->
            <!--            var strWeek=arr_week[dt.getDay()];-->
            <!--            var strHour=dt.getHours();-->
            <!--            var strMinutes=dt.getMinutes();-->
            <!--            var strSeconds=dt.getSeconds();-->
            <!--            if (strMinutes<10) strMinutes="0"+strMinutes;-->
            <!--            if (strSeconds<10) strSeconds="0"+strSeconds;-->
            <!--            var strYear=dt.getFullYear()+"年";-->
            <!--            var strMonth=(dt.getMonth()+1)+"月";-->
            <!--            var strDay=dt.getDate()+"日";-->
            <!--            &lt;!&ndash;var strTime=strHour+":"+strMinutes+":"+strSeconds;&ndash;&gt;-->
            <!--            strTime=strHour+":"+strMinutes;-->
            <!--            time.innerHTML=strYear+strMonth+strDay+" "+strTime+"  "+strWeek;-->
            <!--        }-->
            <!--        setInterval("setTime()",1000);-->
            <!--        /*]]>*/-->
            <!--    </script>-->
            <!--</li>-->
        </div>
    </div>
</form>
<!--表格-->
<div class="layui-container " id="tableid" style="width: 100%" >
        <table class="" id="test" lay-filter="test" style="margin-top:50px;"></table>
</div>
<!--操作块代码-->
<script type="text/html" id="active">
    <div class="layui-input-block" style="margin-left: 0px">
           <!--查看按钮控制-->
           {{#  if(d.taskStatusName == "执行中"){  }}
              <button type="button" class="layui-btn layui-btn-primary layui-btn-sm"  lay-event="ChaKan" >查看</button>
           {{# }else if(d.taskStatusName == "已分配"){ }}
             <button type="button" class="layui-btn layui-btn-primary layui-btn-sm"  lay-event="ChaKan" >查看</button>
           {{# }else if(d.taskStatusName == "已完成"){ }}
              <button type="button" class="layui-btn layui-btn-primary layui-btn-sm"  lay-event="ChaKan" >查看</button>
           {{# }else{ }}
              <button type="button" class="layui-btn layui-btn-primary layui-btn-sm layui-btn-disabled"  disabled lay-event="ChaKan" >查看</button>
           {{# } }}
           <!--分配按钮控制-->
           {{#  if(d.taskStatusName != "待分配"){  }}
                 <button type="button" class="layui-btn layui-btn-normal layui-btn-sm layui-btn-disabled"  lay-event="FenPeiRenWu">分配任务</button>
           {{# }else { }}
                  <button type="button" class="layui-btn layui-btn-normal layui-btn-sm" lay-event="FenPeiRenWu">分配任务</button>
           {{# } }}
           <!--修改按钮控制 只有只有当任务状态为：待分配，才可以进行任务修改操作。-->
           {{#  if(d.taskStatusName == "待分配"){  }}
                   <button type="button" class="layui-btn layui-btn-normal layui-btn-sm" lay-event="del">取消</button>
                   <button type="button" class="layui-btn layui-btn-primary layui-btn-sm"  lay-event="update">修改</button>
           {{# }else{ }}
                   <button type="button" class="layui-btn layui-btn-normal layui-btn-sm layui-btn-disabled" lay-event="del">取消</button>
                   <button type="button" class="layui-btn layui-btn-normal layui-btn-sm  layui-btn-disabled" lay-event="update">修改</button>
           {{# } }}
    </div>
</script>
<!--js文件-->
<script src="/webjars/layui/2.5.5/layui.js" charset="utf-8"></script>
<script type="text/javascript" src="/static/component/pear/pear.js" ></script>
<!--<script type="text/javascript" src="/static/component/layui/dtree.js"></script>-->

<script type="text/javascript">
    //数据初始化
    layui.use(["jquery","layer","form","table","laydate"],function () {
        let layer=layui.layer;
        let $=layui.$;
        let $2=layui.jquery;
        let table=layui.table;
        let laydate=layui.laydate;
        let form=layui.form;
        //动态的任务编号
        //数据表格
         table.render({
            elem:'#test'
            ,url:'/XunJiAnRenWu/ChaShuJu'
            ,cols: [
                [
                     {field:'id',  title: 'ID',sort: true,hide:true}
                    ,{field:'inspectionTaskCode', title: '巡检任务编号'}
                    ,{field:'inspectionTaskName', title: '巡检任务名称'}
                    ,{field: 'lineName',title:'线路名字'}
                    ,{field: 'startPoleCode',title:'起始杆号'}
                    ,{field: 'endPoleCode',title:'终止杆子号'}
                    ,{field: 'issuedByName',title:'下发人'}
                    ,{field: 'issuedTime',title:'下发时间'}
                    ,{field: 'taskStatusName',title:'任务状态'}
                    ,{field: 'finishTime',title:'完成时间',templet: function(d){
                        return d.finishTime=" "?"———":d.finishTime;
                    }}

                    ,{field: 'isFouQuXiao',title:'取消否',templet: function(d){
                        return d.finishTime="0"?"否":"是";
                    }}
                    ,{field:'beiZhu',title:'备注',templet: function(d){
                        return d.beiZhu=" "?"———":d.beiZhu;
                    }}
                    ,{field: 'aa',title:'操作',templet:"#active",width:"320"}
                ]
            ],
            page:{
                limit:3,
                limits:[3,6,9]},
        });
        $.ajax({
            url:"/XiaoQueHuiZhi/chaRenWuZhuangTai",
            dataType: 'json',
            success: function(data) {
                if (data!== null) {
                    $(".service3").empty();
                    $(".service3").append(new Option("--请选择--","0"));
                    $.each(data, function(index, item) {
                        $('.service3').append(new Option(item.configName,item.id));
                    });
                } else {
                    $(".service3").append(new Option("暂无数据","0"));
                }
                //重新渲染
                form.render("select");
            }
        })
        //表格监听
        table.on("tool(test)",function ({data,event}) {
                switch (event) {
                    case "update":
                        //更改
                        if(data.taskStatusName!="待分配"){
                            layer.alert("此信息已是"+data.taskStatusName+"不能在修改")
                            return;
                        }
                        update(data);
                        break;
                    case "del":
                        //取消
                        if(data.taskStatusName!="待分配"){
                            layer.alert("此信息已是"+data.taskStatusName+"不能在取消")
                            return;
                        }
                        del(data.id);
                        break;
                    case "ChaKan":
                        //查看
                        chaKan(data);
                        break;
                    case "FenPeiRenWu":
                        //分配任务
                        if(data.taskStatusName!="待分配"){
                            layer.alert("此信息已是"+data.taskStatusName+"不能在重新分配")
                            return;
                        }
                        FenPeiRenWu(data.id,data.taskStatusName);
                        break;
                }
            })
        //表单监听
        form.on('submit(test)', function(data) {
            alert("你好啊")
            console.log(data.field+"aaaaaaaa");
            // table.reload('test', {
            //     where: data.field
            // })
            return false;
        });
    });

    //查看
    function chaKan(k) {
        layui.use(["jquery","layer","form","table",'transfer','util','popup','dtree'],function (){
            let layer=layui.layer;
            let $=layui.$;
            let table=layui.table;
            let popup = layui.popup;
            let transfer = layui.transfer;
            let form =layui.form;
            let dtree=layui.dtree;
            layer.open({
                type:1,
                title:"查看信息",
                area:["930px","670px"],
                content:$("#chKan"),
                success: function(layero, index){
                    //信息
                    $.ajax({
                        url:'/XunJiAnRenWu/ChaXunJianYuan',
                        dataType:'json',
                        data:{"id":k.id},
                        type: 'get',
                        success:function(data){
                            let name=[];
                            let zifu="";
                            for (let i=0;i<data.length;i++){
                                console.log(data[i].inspectorName);
                                // console.log(data[i]);
                                name.push(data[i].inspectorName);
                            }
                            if(data.length==0){
                                $(".XunJianYuan").html("当前任务未分配")
                            }else if(data.length!=1) {//
                                 zifu=name.join(",")
                                 $(".XunJianYuan").html(zifu);
                            }else if(data.length==1){
                                $(".XunJianYuan").html(name.toString())
                            }

                        }
                    });
                    //巡检员
                    $.ajax({
                        url:'/XunJiAnRenWu/ChaDanXunJiAnRenWu',
                        dataType:'json',
                        data:{"id":k.id},
                        type: 'get',
                        success:function(data){
                            $(".rrWuBiAnHao").html(data.inspectionTaskCode);
                            $(".rrWuMingChEng").html(data.inspectionTaskName);
                            $(".xXunJiAn").html(data.lineName);
                            $(".QQiShiGanHao").html(data.startPoleCode);
                            $(".zZhoNgZhiGanHao").html(data.endPoleCode);
                            $(".xXiAoFaRen").html(data.issuedByName);
                            $(".xXiAFaShiJin").html(data.issuedTime);
                            $(".RRenWuZhuAngTai").html(data.taskStatusName);
                            $(".RRWuWanCheNgShiJiAn").html(data.finishTime);
                            if(data.beiZhu==""){
                                $(".bieZhuXinXi").html("无");
                            }else {
                                $(".bieZhuXinXi").html(data.beiZhu);
                            }

                        }
                    })
                    dtree.render({
                        elem:"#demoTree1",
                        url:"/XunJianZhiXing/xianlu?lineName="+k.lineName,
                        // url:"/static/admin/data/ceshi01.json",
                        type:"all",
                        method:"get",
                        // request:{"lineName":date},
                        // initLevel:"1",
                        // icon:'2',
                        // dataStyle: "layuiStyle",  //使用layui风格的数据格式
                        // dataFormat: "list",  //配置data的风格为list
                        // response:{message:"msg"},
                        // checkbar:true, //开启复选框
                        // response:{message:"msg",statusCode:0}  //修改response中返回数据的定义
                    });
                }
            });
            // 查看点击树形控件赋值
            dtree.on("node('demoTree1')" ,function(obj){
                //$("#queLei1").empty();
                // $("#queJi1").empty();

                //拿到线路名称
                // console.log(obj.param.context);
                // console.log(obj.param);
                // console.log(k.id)
                $.ajax({
                    url:"/XunJianZhiXing/ChaKanLu?poleCode="+obj.param.context+"&taskId="+k.id,
                    dataType: 'json',
                    success: function(data){
                        console.log(data)
                        $(".lineCode").html(data.lineCode);
                        if(data.isBug==0){
                            $(".isBug").html("无");
                        }else if(data.isBug==1){
                            $(".isBug").html("有");
                        }
                        /*缺陷类型*/
                        $(".bugTypeName").html(data.bugTypeName);
                        $(".bugDesc").html(data.bugDesc);
                        $(".inspectTime").html(data.inspectTime);
                        $(".discovererName").html(data.discovererName);
                        $(".createBy").html(data.createBy);
                        $(".poleCode").html(data.poleCode);
                        $(".intactRate").html(data.intactRate);
                        /*缺陷级别*/
                        $(".bugLevel").html(data.bugLevel);
                        $(".discoverTime").html(data.discoverTime);
                        $(".creationTime").html(data.creationTime);
                    }
                })
                $("#a1").text("");
                $("#a2").text("");
                $("#a3").text("");
                $("#a4").text("");
                $("#a5").text("");
                $("#a6").text("");
                $("#a7").text("");
                $("#a8").text("");
                $("#a9").text("");
                $("#d").text("");
                $("#c").text("");
                $("#b").text("");

            });
        });
    };

    //分配任务
    function  FenPeiRenWu(id,ZhuAngTai) {
             // alert("分配任务")
             layui.use(["jquery","layer","form","table",'transfer','util','popup'],function () {
                 let layer=layui.layer;
                 let $=layui.$;
                 let table=layui.table;
                 let popup = layui.popup
                     ,transfer = layui.transfer
                 $.post("/XunJiAnRenWu/ChaChuAnSuoKuang",function(c){
                     transfer.render({
                          elem:'#FenPeiRenWu'
                         ,data:c
                         ,width:150 //定义宽度
                         ,height:210 //定义高度
                         ,title:['待选巡检员', '已选巡检员']
                         ,id: 'key123' //定义唯一索引
                     })
                 })
                 layer.open({
                     type:1,
                     content:$("#FenPeiRenWu"),//divID
                     area:["500px","350px"],
                     btn:["确定","取消"],
                     title:"分配巡检",
                     yes(){
                         let getData = transfer.getData('key123'); //获取右侧数据
                         let aa=JSON.stringify(getData);
                         $.ajax({
                             type:'POST',
                             dataType: "json",
                             contentType: 'application/json;charset=utf-8',
                             url:"/XunJiAnRenWu/FenPeiRenWu?id="+id,
                             data:aa,
                             success:function (c) {
                                 if(c.msg=="分配成功"){
                                     layer.close(layer.index);
                                     popup.success("分配成功")
                                     table.reload("test")

                                 }else {
                                     layer.close(layer.index);
                                     popup.success("分配失败")
                                 }
                             },
                         });
                     },
                 });
             //layui  结束标签
             })
         };

    //修改
    function  update(dt) {
        //第一步  打开 弹框
        layui.use(["jquery","layer","form","table",'transfer','util','popup'],function (){
            let layer=layui.layer;
            let $=layui.$;
            let table=layui.table;
            let popup = layui.popup;
            let transfer = layui.transfer;
            //第一个下拉框
            layer.open({
                type:1,
                content:$("#addmk"),//divID
                area:["800px","752px"],
                btn:["确定","取消"],
                title:"修改巡检信息",
                yes(){
                    //获取add巡检信息
                    let  addXunJIanYuan=layui.transfer.getData('keyZeng'); //获取右侧数据
                    //最外围是个对象
                    //第二层是个对象属性
                    FengZhuangDeZongShuJu.psInspectiontaskMain=parms;
                    FengZhuangDeZongShuJu.psInspectorDetail=addXunJIanYuan
                    console.log(JSON.stringify(FengZhuangDeZongShuJu)+"Json格式")
                    let xi=JSON.stringify(FengZhuangDeZongShuJu);
                    // $.ajax({
                    //     type:'POST',
                    //     dataType:"json",
                    //     contentType:'application/json;charset=utf-8',
                    //     url:"/XunJiAnRenWu/AddXunJiAnRenWu",
                    //     data:xi,
                    //     success:function (c) {
                    //         if(c.msg=="添加巡检信息成功"){
                    //             // layer.closeAll(layer.index);
                    //             popup.success("增加成功");
                    //             arr1=[];
                    //             table.reload("test");
                    //         }else {
                    //             popup.success("增加失败")
                    //         }
                    //         layer.closeAll('page'); //关闭所有页面层
                    //     },
                    // });

                },success: function(layero, index){
                    $("#addmk>form")[0].reset();
                    console.log(dt.beiZhu+"字符串")
                    let qiSHiGanZi=$('#qiShiGanZi1').children().length;
                    let xianLu= $('#xnluXiaLa').children.length;
                    if(xianLu!=1){
                        $("#xnluXiaLa").empty();
                        $("#xnluXiaLa").append(new Option("请选择",'0'))
                    }
                    if(qiSHiGanZi!=1){
                        $("#qiShiGanZi1").empty();
                        $("#qiShiGanZi1").append(new Option("请选择起始杆号",'0'))
                        $("#jeiShuGanHao").empty();
                        $("#jeiShuGanHao").append(new Option("请选择结束杆号",'0'))
                    }
                    $.ajax({
                        url:'/GanTaiGuanLi/XiaLaKuang',
                        dataType:'json',
                        type: 'get',
                        async: false,
                        success:function(data){
                            $.each(data,function (index,value) {
                                $('#xnluXiaLa').append(new Option(value.lineName,value.id));// 下拉菜单里添加元素
                            });
                            layui.form.render("select");//重新渲染 固定写法
                            //查询
                            // alert(dt.lineId);
                        }
                    });
                    //线路下拉框的id  赋值
                    $('#xnluXiaLa').val(dt.lineId);
                    $('#qiShiGanZi1').val(dt.startPole);
                    $('#jeiShuGanHao').val(dt.endPole);
                    let chan= $('#xnluXiaLa').val();
                    //起始杆子号终止杆子号 修改赋值
                    $.ajax({
                        url:'/GanTaiGuanLi/ChaXianGanTai',
                        dataType:'json',
                        data:{"id":chan},
                        type:'get',
                        async: false,
                        success:function(data){
                            $.each(data,function (index,value) {
                                $('#qiShiGanZi1').append(new Option(value.poleCode,value.id));// 下拉菜单里添加元素
                                $('#jeiShuGanHao').append(new Option(value.poleCode,value.id));
                            });
                            layui.form.render("select");//重新渲染 固定写法
                            //查询
                        }
                    });
                    //巡检员赋值  得到当前任务id  去巡检明细表里查找
                    let  xiuGaiXUnJianYuanShuZU=[];
                    $.ajax({
                        url:'/XunJiAnRenWu/ChaXunJianYuan',
                        dataType:'json',
                        data:{"id":dt.id},
                        type:'get',
                        async: false,
                        success:function(data){
                            $.each(data,function (index,value) {
                                   xiuGaiXUnJianYuanShuZU.push(value.inspectorName);
                            });
                            let  fenGeShuJu= xiuGaiXUnJianYuanShuZU.join(",");
                            $(".xunJiAnYuan").val(fenGeShuJu);
                            //从新赋值  穿梭框
                            layui.form.render("select");//重新渲染 固定写法
                            //查询
                        }
                    });
                    layui.use(['form'], () => {
                        let form = layui.form
                        form.val("addform",dt);
                        form.render();
                    });
                }
            });
            //结束标签
        });
    };

    //删除
    function  del(id) {
             layui.use(["jquery","layer","form","table"],function () {
                 let layer=layui.layer;
                 let $=layui.$;
                 let table=layui.table;
                 let popup = layui.popup;
                 $.post("/XunJiAnRenWu/QuXiAoXunJiAn",{id:id},function (c){
                     if(c.msg=="取消成功"){
                         layer.msg("取消成功", {icon: 6});
                         table.reload("test",{
                             page:{
                                 curr: 1 //重新从第 1 页开始
                             }
                         })
                     }else {
                         layer.msg("取消失败", {icon: 5});
                     }
                 });
             });
         };

    //查询
    function  ChaXUn() {
        alert("查询")
    };

    //巡检员表单接受值

    //穿梭框数据
    let arr1=[];
    //返回后台的数据对象
    let FengZhuangDeZongShuJu=new Object();

    //添加巡检
    function  addXunJian() {
            //第一步  打开 弹框
            layui.use(["jquery","layer","form","table",'transfer','util','popup'],function (){
                let layer=layui.layer;
                let $=layui.$;
                let table=layui.table;
                let popup = layui.popup;
                let transfer = layui.transfer;
                $(".xunJiAnYuan").val("");
                //下拉框赋值长度
                let aa=$('#xnluXiaLa').children().length;
                $("#addmk>form")[0].reset();
                //第一个下拉框
                if(aa==1){
                    $.ajax({
                        url:'/GanTaiGuanLi/XiaLaKuang',
                        dataType:'json',
                        type: 'get',
                        success:function(data){
                            $.each(data,function (index,value) {
                                $('#xnluXiaLa').append(new Option(value.lineName,value.id));// 下拉菜单里添加元素
                            });
                            layui.form.render("select");//重新渲染 固定写法
                            //查询
                        }
                    })
                }
                layer.open({
                    type:1,
                    content:$("#addmk"),//divID
                    area:["800px","752px"],
                    btn:["确定","取消"],
                    title:"增加巡检信息",
                    yes(){
                        //插入数据赋值
                        //获取add巡检信息
                        let parms=layui.form.val("addform");  //拿到表单元素
                        let addXunJIanYuan="";
                        if($(".xunJiAnYuan").val()!=""){
                             addXunJIanYuan=layui.transfer.getData('keyZeng'); //获取右侧数据
                        }else {
                            addXunJIanYuan=null;
                        }
                        //最外围是个对象
                        //第二层是个对象属性
                        FengZhuangDeZongShuJu.psInspectiontaskMain=parms;
                        FengZhuangDeZongShuJu.psInspectorDetail=addXunJIanYuan;
                        console.log(JSON.stringify(FengZhuangDeZongShuJu)+"Json格式")
                        let xi=JSON.stringify(FengZhuangDeZongShuJu);
                        $.ajax({
                            type:'POST',
                            dataType:"json",
                            contentType:'application/json;charset=utf-8',
                            url:"/XunJiAnRenWu/AddXunJiAnRenWu",
                            data:xi,
                            success:function (c) {
                                if(c.msg=="添加巡检信息成功"){
                                    // layer.closeAll(layer.index);
                                    popup.success("增加成功");
                                    arr1=[];
                                    table.reload("test");
                                }else {
                                    popup.success("增加失败")
                                }
                                layer.closeAll('page'); //关闭所有页面层
                            },
                        });
                    },
                });
            //结束标签
            });
        };

    //获得光标 显示穿梭框
    layui.use(["jquery","layer","form","table",'transfer','util','popup'],function (){
        let layer=layui.layer;
        let $=layui.$;
        let table=layui.table;
        let popup = layui.popup;
        let transfer = layui.transfer;
        let form =layui.form;
        $(".xunJiAnYuan").focus(function (){
            let arrJson=JSON.stringify(arr1);
            //赋值穿梭框
            if($(".xunJiAnYuan").val()==""){
                $.post("/XunJiAnRenWu/ChaChuAnSuoKuang",function(c){
                    transfer.render({
                         elem:'#ZeNgJiaChuAnSUo'
                        ,data:c
                        ,width:150 //定义宽度
                        ,height:210 //定义高度
                        ,title:['待选巡检员', '已选巡检员']
                        ,id:'keyZeng' //定义唯一索引
                    })
                });
            }else{
                $.post("/XunJiAnRenWu/ChaChuAnSuoKuang",function(c){
                    transfer.render({
                        elem:'#ZeNgJiaChuAnSUo'
                        ,data:c
                        ,width:150 //定义宽度
                        ,height:210 //定义高度
                        ,title:['待选巡检员', '已选巡检员']
                        ,id: 'keyZeng' //定义唯一索引
                        ,value:arrJson
                    })
                })
            };
            //打开穿梭框
            layer.open({
                type:1,
                content:$("#ZeNgJiaChuAnSUo"),//divID
                area:["500px","350px"],
                btn:["确定","取消"],
                title:"添加巡检员 ",
                yes(){
                    //1.穿梭框表单数据
                    let  getData = transfer.getData('keyZeng');
                    //2.表单显示名字数组
                    let arr = new Array();
                    for(let i=0;i<getData.length;i++){
                        arr.push(getData[i].title)
                    }
                    //3.value 值数组
                    arr1 = new Array();
                    for(let i=0;i<getData.length;i++){
                        arr1.push(getData[i].value)
                    }
                    //4.分隔符赋值
                    let  FenGeHou =arr.join(",")
                    $(".xunJiAnYuan").val(FenGeHou);
                    layer.close(layer.index);
                },
                cancel:function(index,layero) {
                    // let getData = transfer.getData('keyZeng');
                    // console.log("getDate"+getData)
                    // //名字数组
                    // for(let i=0;i<getData.length;i++){
                    //
                    //     arr.push(getData[i].title)
                    // }
                    // //value 数组
                    // arr1 = new Array();
                    // for(let i=0;i<getData.length;i++){
                    //     arr1.push(getData[i].value)
                    // }
                    //  FenGeHou =arr.join(",")
                    // $(".xunJiAnYuan").val(FenGeHou);
                    // layer.close(layer.index);
                }
            });
        });
    });

    //form  表单 中的选择框的监听 和一些小效果
    layui.use(["jquery","layer","form","table",'transfer','util','popup'],function (){
        let layer=layui.layer;
        let $=layui.$;
        let table=layui.table;
        let popup = layui.popup;
        let transfer = layui.transfer;
        let form =layui.form;
        //我改变了事件
        let diYiKuangdeZHi=null;
        form.on("select(xnluXiaLa)",function(data){
            //线路监听以后
            layui.config({
                base: '../static/component/pear/modules/' //配置 layui 第三方扩展组件存放的基础目录
            }).extend({
                pinyin:'pinyin' //以 regionSelect 组件为例，定义该组件模块名
            }).use(['pinyin'], function () {
                let pinyin =layui.pinyin;
                let ce=data.elem[data.elem.selectedIndex].text;
                 //console.log(pinyin.ConvertPinyin(ce));    //mihuchong
                 //console.log(pinyin.makePy(ce));   //["MHC"]
                let outTradeNo="";  //订单号
                for(let i=0;i<4;i++) //6位随机数，用以加在时间戳后面。
                {
                    outTradeNo += Math.floor(Math.random()*10);
                }
               // outTradeNo = new Date().getTime() + outTradeNo;  //时间戳，用来生成订单号。

                $("#RenWuMingCheng").val(ce+"巡检");
                let shuZU = pinyin.makePy(ce);
                $("#RenWUBiAnMa").val(shuZU[0]+outTradeNo);
                // console.log(shuZU[0]);
            });
            diYiKuangdeZHi=data;
            let aa=$('#qiShiGanZi1').children().length;
            if(aa!=1){
                $("#qiShiGanZi1").empty();
                $("#qiShiGanZi1").append(new Option("请选择起始杆号",'0'))
                $("#jeiShuGanHao").empty();
                $("#jeiShuGanHao").append(new Option("请选择结束杆号",'0'))
             }
                $.ajax({
                    url:'/GanTaiGuanLi/ChaXianGanTai',
                    dataType:'json',
                    data:{"id":data.value},
                    type:'get',
                    success:function(data){
                        $.each(data,function (index,value) {
                            $('#qiShiGanZi1').append(new Option(value.poleCode,value.id));// 下拉菜单里添加元素
                            $('#jeiShuGanHao').append(new Option(value.poleCode,value.id));
                        });
                        layui.form.render("select");//重新渲染 固定写法
                        //查询
                    }
                })
        });
        form.on("select(qiShiGanZi1)",function(data){
          let qishiid=  $("#xnluXiaLa").val();
            $.ajax({
                url:'/GanTaiGuanLi/ChaXianGanTai',
                dataType:'json',
                data:{"id":qishiid},
                type:'get',
                success:function(data){
                    $("#jeiShuGanHao").empty();
                    $("#jeiShuGanHao").append(new Option("请选择结束杆号",'0'))
                    $.each(data,function (index,value) {
                        if($('#qiShiGanZi1').val()!=value.id){
                            $('#jeiShuGanHao').append(new Option(value.poleCode,value.id));
                        }
                    });
                    layui.form.render("select");//重新渲染 固定写法
                    //查询
                }
            })
        });
    });

</script>
</body>
<!--修改表单-->
<div id="updatemk" style="display:none;margin: auto auto" class="aa">
    <form class="layui-form" lay-filter="updateform" action="" style="padding: 50px">
        <input  type="hidden" name="id"/>
        <div class="layui-form-item" style="margin-right: 30px">
            <label class="layui-form-label">缺陷类型:</label>
            <div class="layui-input-block">
                <input id="a" type="text" name="configName" required  lay-verify="required" placeholder="请输入缺陷类型" autocomplete="off" class="layui-input layui-disabled">
            </div>
        </div>
    </form>
</div>
<!--查看表单-->
<div id="chKan" style="display:none;margin: auto auto" class="aa">
    <fieldset class="layui-elem-field site-demo-button" style="margin-top: 10px;width:880px;">
        <legend>基本信息</legend>
        <div class="layui-field-box message" >
               <ul class="message01 q">
                   <li>任务编号:<span class="rrWuBiAnHao"></span></li>
                   <li>任务名称:<span class="rrWuMingChEng"></span></li>
                   <li>巡检线路:<span class="xXunJiAn"></span></li>
                   <li>起始杆号:<span class="QQiShiGanHao"></span></li>
               </ul>
               <ul class="message02 q">
                   <li>终止杆号:<span class="zZhoNgZhiGanHao"></span></li>
                   <li style="margin-left: 15px">下发人:<span class="xXiAoFaRen"></span></li>
                   <li style="margin-left: 15px">下发时间:<span class="xXiAFaShiJin"></span></li>
                   <li>任务状态:<span class="RRenWuZhuAngTai"></span></li>
               </ul>
            <ul class="message02 q">
                <li>完成时间:<span class="RRWuWanCheNgShiJiAn"></span></li>
                <li >备注信息:<span class="bieZhuXinXi"></span></li>
                <li style="margin-left: 15px">巡检员:<span class="XunJianYuan"></span></li>
            </ul>
        </div>
    </fieldset>
    <fieldset class="layui-elem-field site-demo-button" style="margin-top: 10px;width: 200px;height:400px; float: left;margin-left: 20px">
        <legend>线路</legend>
        <ul id="demoTree1" class="dtree" data-id="0" style=""></ul>
    </fieldset>
    <fieldset class="layui-elem-field" style="width: 570px;height: 400px;float: right;margin-top: 10px;margin-right: 20px">
        <legend>信息</legend>
        <div class="XianLuXinXi">

                <div class="zuo">
                    <ul class="q">
                        <li>线路编码:<span class="lineCode" id="a1"></span></li>
                        <li>有无故障:<span class="isBug" id="a2"></span></li>
                        <li>缺陷类型:<span class="bugTypeName" id="a3"></span></li>
                        <li>缺陷描述:<span class="bugDesc" id="a4"></span></li>
                        <li>巡检时间:<span class="inspectTime" id="a5"></span></li>
                        <li>缺陷发现人:<span class="discovererName" id="a6"></span></li>
                        <li>下发人员:<span class="createBy" id="a7"></span></li>
                    </ul>
                </div>
                <div class="you">
                    <li>杆塔编码:<span class="poleCode" id="a8"></span></li>
                    <li>*完好率:<span class="intactRate" id="a9"></span></li>
                    <li>缺陷级别:<span class="bugLevel" id="d"></span></li>
                    <li><span>&nbsp;</span></li>
                    <li><span>&nbsp;</span></li>
                    <li>发现时间:<span class="discoverTime" id="c"></span></li>
                    <li>下发时间:<span class="creationTime" id="b"></span></li>
                </div>
        </div>
    </fieldset>
</div>
<!--增加-->
<div id="addmk" style="display:none;"  >
    <form class="layui-form" lay-filter="addform" action="" style="padding: 25px;overflow-y:hidden;">
        <div class="layui-form-item" style="margin-right: 30px">
            <label class="layui-form-label">任务编码:</label>
            <div class="layui-input-block">
                <input id="RenWUBiAnMa" type="text" name="inspectionTaskCode" required  lay-verify="required" placeholder="任务编号"  autocomplete="off" class="layui-input layui-disabled">
            </div>
        </div>
        <div class="layui-form-item" style="margin-right: 30px">
            <label class="layui-form-label">任务名称:</label>
            <div class="layui-input-block">
                <input id="RenWuMingCheng"  type="text" name="inspectionTaskName" required  lay-verify="required" placeholder="任务名称" autocomplete="off" class="layui-input layui-disabled">
            </div>
        </div>
        <div class="layui-form-item" style="margin-right: 30px" lay-filter="xunJiAnXianLu">
            <label class="layui-form-label">巡检线路:</label>
            <div class="layui-input-inline">
                <select name="lineId" lay-filter="xnluXiaLa" id="xnluXiaLa">
                    <option value="0">请选择</option>
                </select>
            </div>
        </div>
        <div class="layui-form-item" style="margin-right: 30px">
            <label class="layui-form-label">巡检员:</label>
            <div class="layui-input-block">
                <textarea placeholder="请输入巡检员内容" class="layui-textarea xunJiAnYuan"></textarea>
            </div>
        </div>
        <div class="layui-form-item" style="margin-right: 30px" lay-filter="qiSHiGanHao">
            <label class="layui-form-label">起始杆号:</label>
            <!--<div class="layui-input-block">-->
            <!--    <input id="QiShiGanZiHao" type="text" name="RenWuBianMa" required  lay-verify="required" placeholder="请输入起始杆号" autocomplete="off" class="layui-input">-->
            <!--</div>-->
            <div class="layui-input-inline">
                <select name="startPole" lay-verify="" id="qiShiGanZi1" lay-filter="qiShiGanZi1">
                    <option value="0">请选择起始杆号</option>
                </select>
            </div>
        </div>
        <div class="layui-form-item" style="margin-right: 30px">
            <label class="layui-form-label">终止杆号:</label>
            <div class="layui-input-inline" >
                <select name="endPole" lay-verify="" id="jeiShuGanHao">
                    <option value="0">请选择结束杆号</option>
                </select>
            </div>
        </div>
        <div class="layui-form-item" style="margin-right: 30px">
            <label class="layui-form-label">下发人:</label>
            <div class="layui-input-block">
                <input id="addXunJiAnXiaFaRen" type="text" name="issuedByName" required  lay-verify="required" placeholder="请输入下发人" autocomplete="off" readonly="true"  class="layui-input layui-disabled" th:value="${session.loginUser.userName}">
            </div>
        </div>
        <div class="layui-form-item" style="margin-right: 30px">
            <label class="layui-form-label">下发日期:</label>
            <div class="layui-input-block">
                <input id="xiaFaRiQiID" type="text" name="issuedTime" required  lay-verify="required" placeholder="请输入下发日期" autocomplete="off" readonly="true" class="layui-input layui-disabled" th:value="${#dates.format(new java.util.Date().getTime(), 'yyyy-MM-dd HH:mm:ss')}">
            </div>
        </div>
        <div class="layui-form-item" style="margin-right: 30px">
            <label class="layui-form-label">备注:</label>
            <div class="layui-input-block">
                <textarea placeholder="请输入备注" class="layui-textarea" name="beiZhu" id="bz"></textarea>
            </div>
        </div>
    </form>
</div>
<!--分配任务id-->
<div id="FenPeiRenWu" class="demo-transfer" style="display:none;margin-left: 65px;margin-top: 35px"></div>
<!--增加巡检任务-->
<div id="ZeNgJiaChuAnSUo" class="demo-transfer" style="display:none;margin-left: 65px;margin-top: 35px"></div>

</html>